<template>
    <div v-if="store.getters['setting/routerView']" class="app-main-container">
        <transition mode="out-in" name="fade-transform">
            <router-view class="app-main-height" />
        </transition>
    </div>
</template>

<script>
export default {
    name: 'AppMain',
}
</script>

<script setup>
import { useStore } from 'vuex'

const store = useStore()
</script>

<style lang="scss" scoped>
.app-main-container {
    box-sizing: border-box;
    width: $base-width;
    text-align: left;
    background-color: $base-color-white;
    height: 100%;
    border-radius: 8px;
    box-shadow: 0px 10px 20px 0px rgba(186, 200, 220, 0.2);
}
</style>
